import { createApp } from 'vue';
import App from './App.vue';
import router from './router/index';
import store from './store/index'
import ElementPlus from 'element-plus';

import 'element-plus/dist/index.css';
import * as ElementPlusIconsVue from '@element-plus/icons-vue';

// 注册全局指令
import api from './api';


const app=createApp(App);

// 全局引入+$代表属性是程序员自己添加的
app.config.globalProperties.$api=api

// 全局自定义指令
app.directive('has',{
  // 操作节点
  beforeMount:(el,binding)=>{
    // el当前使用自定义指令的节点
    // binding传递参数  binding拿到'user-create'
    // 遍历actionList查找binging，有则有权限，无则需要进行处理
    let actionList=store.state.actionList;
    let value=binding.value;
    let permission=actionList.includes(value)
    if(!permission){
      // 进入该分支无权限
      el.style="display:none";
      setTimeout(()=>{
        el.parentNode.removeChild(el)
      },0)
    }
  }
})

import QueryForm from './packages/QueryForm'
import BaseTable from './packages/BaseTable'

app.use(router).use(ElementPlus).use(store).use(QueryForm).use(BaseTable).mount('#app');


// 全局引入element icon
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
  }

  //按钮权限：
  // 1.接口数据：actionList
    // -将该数据存入vuex